﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="UserInfo.aspx.cs" Inherits="RaceList.activity.relay.UserInfo" %>
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />

        <title>随便走</title>

        <meta name="keywords" content="">
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1,minimum-scale=1,user-scalable=no;" />

        <link href="style/layout.css" rel="stylesheet" />
        <script src="js/jquery-1.9.1.min.js"></script>


    </head>
    <body>
        <section id="web_wrap">
            <!-- 页面框架 -->
            <div class="container">
                <div class="bg_box">
                    <a href="javascript:;" class="rule">返回首页</a>


                    <div class="rulecon prizecon">
                        <h3>每天前100名兑奖者可获得幸运奖品！</h3>
                        <h5>请认真填写您的信息以便我们为您发放奖品</h5>
                        <form runat="server">
                            <asp:TextBox type="text" placeholder="兑奖码" ID="txtCode" runat="server" MaxLength="16"></asp:TextBox>
                            <div id="userinfo" style="display: none">
                                <asp:TextBox placeholder="真实姓名" ID="txtName" runat="server"></asp:TextBox>
                                <asp:TextBox placeholder="手机号码" ID="txtPhone" runat="server"></asp:TextBox>
                                <asp:Button type="submit" Text="确定领奖" ID="Submit" class="getPri" OnClick="Submit_Click" runat="server"
                                            OnClientClick=" return Validate() " />
                            </div>
                        </form>
                        <h6>(如果您获得实物奖品，我们将电话联系您获取收件信息）</h6>
                    </div>

                    <div class="clear"></div>
                    <div class="footer">
                        <div class="footer_text">
                            <p>Copyright © 2014-2015</p>
                            <p>深圳感知网络有限公司 版权所有</p>
                        </div>
                    </div>
                </div>


                <div class="suibianDL">
                    <div class="suibianDL_left">
                        <img src="images/logo.jpg" alt="">
                        <h5>随便走</h5>
                        <p>最后一公里生活神器</p>

                        <div class="clear"></div>
                    </div>
                    <div class="suibianDL_right">
                        <a href="http://a.app.qq.com/o/simple.jsp?pkgname=cn.gogocity.suibian">立刻下载</a>
                    </div>

                    <div class="clear"></div>
                </div>
            </div>
        </section>
    </body>
</html>
<script src="js/main.js"></script>
<script>
    var txtCode = $("#<%= txtCode.ClientID %>");
    var txtName = $("#<%= txtName.ClientID %>");
    var txtPhone = $("#<%= txtPhone.ClientID %>");
    $(function() {
        txtCode.on('focus', function() {
            Award();
        });
        txtCode.on('blur', function() {
            Award();
        });

        function Award() {
            if (txtCode.val().trim().length == 16) {
                $.post('Award.ashx', { m: 'CheckCode', code: txtCode.val().trim() }, function(data) {
                    if (data.status != 200) {
                        $('#userinfo').hide();
                        alert(data.message);
                    } else {
                        txtName.val(data.name);
                        txtPhone.val(data.phone);
                        $('#userinfo').show();
                    }
                }, 'JSON');
            }
        }
    });

    function Validate() {
        if (txtCode.val().trim() == "") {
            txtCode.css("border-color", "red");
            txtCode.focus();
            return false;
        }
        if (txtName.val().trim() == "") {
            txtName.css("border-color", "red");
            txtName.focus();
            return false;
        }
        if (txtPhone.val().trim() == "") {
            txtPhone.css("border-color", "red");
            txtPhone.focus();
            return false;
        }
        return true;
    }
</script>